<style scoped>
  .vendorPay{
    margin-right: 0.5vw;
    padding: 0 15px;
    background-color: white;
    height: 95vh;
    position: relative;
  }
  .csb-top{
    display: flex;
    padding: 1.5vh 0;
    border-bottom: 2px solid #f4f4f4;
  }
  .csb-top p:first-child{
    margin: 3px 6px 0 0;
  }
  .csb-top p:not(:first-child){
    margin: 3px 6px 0 12px;
  }
  .csb-middle{
    padding: 1.5vh 0;
    display: flex;
    justify-content: space-between;
  }
  .csb-middle p{
    margin: 3px 6px 0 0;
  }

  .vendorPay .footView span{
    float: left;
    margin-right: 20px;
    line-height: 6vh;
    font-size: 14px;
  }
  .vendorPay .footView span i{
    margin-right: 5px;
  }

    .vendorPay .exPort{
    width: 280px;
    height: 115px;
    background: white;
    position: absolute;
    top: 25%;
    left: 18%;
    z-index: 2;
    padding: 10px 15px;
    box-shadow: 3px 3px 3px #f4f4f4;
  }
  .vendorPay .exPort div:first-child{
    font-weight: 700;
    margin-bottom: 5px;
  }
  .vendorPay .exPort div:last-child{
    float: right;
    margin: 10px 0 0 0;
  }
</style>

<style>
  .vendorPay .el-input__icon {
    line-height: 30px;
  }
  .vendorPay .el-input__inner{
    height: 30px;
  }
  .vendorPay .csb-top .el-date-editor .el-range__icon{
    line-height: 24px;
  }
  .vendorPay .csb-top .el-date-editor .el-range-separator{
    line-height: 24px;
    width: 8%;
  }
  .vendorPay .el-checkbox.is-bordered{
    padding: 4px 5px 0 5px;
    height: 30px;
  }
  .vendorPay .el-table__footer td {
	height:36px;
  
}
</style>

<template>
  <div class="vendorPay">
    <!-- 厂商应付对账单 -->
    <div class="csb-top">
      <p>厂商</p>
    <el-select v-model="manufacturerName" clearable multiple collapse-tags style="width:160px;" >
      <el-option v-for="item in manufacturerList" :key="item.value" :label="item.label" :value="item.value">
        <span style="float:left">{{item.value}}</span>
        <span style="float:right">{{item.label}}</span>
      </el-option>
    </el-select>
    <p>日期</p>
    <el-date-picker 
      unlink-panels
      v-model="dateList" 
      type="daterange" 
      range-separator="至" 
      start-placeholder="开始日期" 
      end-placeholder="结束日期"
      value-format="yyyy-MM-dd"></el-date-picker>
    <p>单据序号</p>
    <el-input v-model="sequence" style="width:160px;" @keyup.enter.native="search(1)"></el-input>
    </div>
    <div class="csb-middle">
      <div>
        <el-button @click="search(1)" type="primary" icon="el-icon-search">查询</el-button>
        <el-button @click="outPut" icon="el-icon-upload2">导出</el-button>
        <el-button @click="printClick" icon="el-icon-printer">列印</el-button>
      </div>
      <div style="display:flex;">
        <el-select v-model="summation" style="width:160px" @change="summationChange">
          <el-option v-for="item in summationList" :key="item.value" :label="item.label" :value="item.value"></el-option>
        </el-select>
      </div>
    </div>
    <el-table 
      :header-cell-style="{background:'#f4f4f4',padding:0,height:'40px'}" 
      :cell-style="{padding:0,height:'36px'}" 
      :data="allData" 
      height="75.5vh"
      show-summary 
      ref="table"
		  :summary-method="getSummaries"
      style="width: 100%">
      <el-table-column type="index" label="序号" width="50"></el-table-column>
      <template v-for="i in csbList">
        <el-table-column :prop="i.prop" :key="i.prop" :label="i.label" :width="i.width"></el-table-column>
      </template>
    </el-table>

    <foot-view class="footView" 
      :pagesNum="pagesNum" 
      :hasPagination=true
      :pageSize="limit"
      :tableTypeChange="tableTypeChange"
      @handleSizeChange="handleSizeChange"
      @handleCurrentChange="handleCurrentChange">
      <div slot="text">
        <span>数据库：{{jxQuarter}}</span>
      </div>
    </foot-view>

    <div id="p" v-show="false"></div>
  </div>
</template>

<script>
const resources = require('../../../config/printCSS6')

import { getManufacturer, manufacturerPaymentQuery } from '../../../network/manufacturer'
import { getSystemConfig } from '../../../network/operatoryCommand'

import footView from '../../../components/FootView'

import table2excel from 'js-table2excel'
import XLSX from "xlsx"

import today from '../../../components/mixins/today'
import enterUp from '../../../components/mixins/enterUp'
import zero from '../../../components/mixins/zero2blank'

export default {
  name:'vendor_pay',
  mixins:[today,enterUp,zero],
  created(){
    let jxQuarterVal = document.cookie.match(RegExp('jxQuarter' + '=([^;]+)'))
    this.jxQuarter = jxQuarterVal ? jxQuarterVal[1] : null
    
    this.inpList = this.getInput()
    this.csbList = this.csbList1
    this.dateList = [this.searchDate(7),this.searchDate()]
    getManufacturer({limit:99999}).then(res => {
      // console.log(res)
      if (res.data.code == 200) {
        res.data.data.forEach(e => {
          this.manufacturerList.push({value:e.no,label:e.name,contact:e.contact,phone:e.phone,address:e.address})
        })
      }
    })
    getSystemConfig().then(res => {
      // console.log(res)
      if (res.data.data) {
        this.companyName = res.data.data.companyName
        this.companyPhone = res.data.data.phone
      }
    })
  },
  data(){
    return{
      inpList: [],
      manufacturerNo: '',
      manufacturerName: '',
      manufacturerList: [],
      dateList: null,
      sequence: '',

      summation: 0,
      summationList:[
        {label:'不集合',value:0},
        {label:'厂商集合',value:1},
        {label:'日期集合',value:2}
      ],

      allData: [],

      csbList: [],
      csbList1:[
        {prop:'sequence',label:'单据序号',width:'160'},
        {prop:'time',label:'日期',width:'120'},
        {prop:'manufacturerNo',label:'厂商编号',width:''},
        {prop:'manufacturerName',label:'厂商简称',width:''},
        {prop:'inputNumber',label:'进',width:''},
        {prop:'outNumber',label:'退',width:''},
        {prop:'inputTotalMoney',label:'进额',width:''},
        {prop:'outTotalMoney',label:'退额',width:''},
        {prop:'discountMoney',label:'折让金额',width:''},
        {prop:'paymentMoney',label:'已付金额',width:''},
        // {prop:'costTotalMoney',label:'成本',width:''},
        {prop:'otherPaymentMoney',label:'其他应付',width:''},
        {prop:'currency',label:'币种',width:''},
      ],
      csbList2: [
        {prop:'manufacturerNo',label:'厂商编号',width:''},
        {prop:'manufacturerName',label:'厂商简称',width:''},
        {prop:'inputNumber',label:'进货数量',width:''},
        {prop:'outNumber',label:'退货数量',width:''},
        {prop:'inputTotalMoney',label:'进货金额',width:''},
        {prop:'outTotalMoney',label:'退货金额',width:''},
        {prop:'otherPaymentMoney',label:'其他应付',width:''},
        {prop:'discountMoney',label:'折让金额',width:''},
        {prop:'paymentMoney',label:'已付金额',width:''},
        // {prop:'time',label:'日期',width:''},
        {prop:'currency',label:'币种',width:''},
      ],
      csbList3: [
        {prop:'inputNumber',label:'进货数量',width:''},
        {prop:'outNumber',label:'退货数量',width:''},
        {prop:'inputTotalMoney',label:'进货金额',width:''},
        {prop:'outTotalMoney',label:'退货金额',width:''},
        {prop:'otherPaymentMoney',label:'其他应付',width:''},
        {prop:'discountMoney',label:'折让金额',width:''},
        {prop:'paymentMoney',label:'已付金额',width:''},
        {prop:'time',label:'日期',width:''},
        {prop:'currency',label:'币种',width:''},
      ],

      // 总数据条数
      dataLen: 0,
      // 总页码
      pagesNum: 0,
      // 分页条数
      limit: 20,
      // 当前页码
      currentPage: 1,
      tableTypeChange: false,
      jxQuarter: null,
      // jxQuarter: document.cookie.match(RegExp('jxQuarter'+'=([^;]+)'))[1],

      summationData: {},
      companyName: '',
      companyPhone: '',

      today: this.searchDate(),

      lastBalance: 0,
      unpaid: 0,
      amountsPayable: 0
    }
  },
  watch: {
    sequence(a,b){
      this.sequence = a.toUpperCase().trim()
    },
    dataLen(a,b){
      this.pagesNum = Math.ceil(this.dataLen / this.limit)
    },
    limit(a,b){
      this.pagesNum = Math.ceil(this.dataLen / this.limit)
    }
  },
  methods:{
    summationChange(e){
      // this.search(1)
      this.allData = []
      this.dataLen = 0
      switch (e) {
        case 0:
          this.csbList = this.csbList1
          break;
        case 1:
          this.csbList = this.csbList2
          break;
        case 2:
          this.csbList = this.csbList3
          break;
      }
    },
    search(f = 0){
      if (f) {
        // console.log('asd')
        this.currentPage = 1
        this.tableTypeChange = !this.tableTypeChange
      }
      this.allData = []

      let params = {
        isExport: false,
        manufacturerNoList: this.manufacturerName,
        sequence: this.sequence,
        assemble: this.summation,
        pageData: {
          limit: this.limit,
          page: this.currentPage
        }
      }
      if (this.dateList) {
        params.startTime = this.dateList[0] + ' 00:00:00'
        params.endTime = this.dateList[1] + ' 23:59:59'
      }
      manufacturerPaymentQuery(JSON.stringify(params)).then(res => {
        // console.log(res)
        if (res.data.code == 200) {
          this.dataLen = res.data.total
          if (!this.dataLen) {
            this.$message.info("暂无数据")
            return
          }
          
          this.lastBalance = res.data.data.totalPaymentVo.lastBalance
          this.unpaid = res.data.data.totalPaymentVo.unpaid
          this.amountsPayable = res.data.data.totalPaymentVo.amountsPayable
          this.allData = res.data.data.paymentQueryList || []

          this.summationData.inputNumber = res.data.data.totalPaymentVo.inputTotal
          this.summationData.outNumber = res.data.data.totalPaymentVo.outputTotal
          this.summationData.inputTotalMoney = res.data.data.totalPaymentVo.inputAmount
          this.summationData.outTotalMoney = res.data.data.totalPaymentVo.outputAmount
          this.summationData.discountMoney = res.data.data.totalPaymentVo.discountAmount
          this.summationData.paymentMoney = res.data.data.totalPaymentVo.earnestAmount
          this.summationData.otherPaymentMoney = res.data.data.totalPaymentVo.otherAmount

          this.zero2blank(this.allData)

          this.$nextTick(() => {
            this.$refs.table.doLayout()
          })
        }
      })
    },

    outPut(){
      let params = {
        isExport: true,
        manufacturerNoList: this.manufacturerName,
        sequence: this.sequence,
        assemble: this.summation,
        pageData: {
          limit: this.limit,
          page: this.currentPage
        }
      }
      if (this.dateList) {
        params.startTime = this.dateList[0] + ' 00:00:00'
        params.endTime = this.dateList[1] + ' 23:59:59'
      }
      if (this.summation === 1) {
        params.noExportFieldList = ['单据序号', '日期']
      } else if (this.summation === 2) {
        params.noExportFieldList = ['单据序号', '厂商编号', '厂商简称']
      }
      manufacturerPaymentQuery(JSON.stringify(params)).then(res => {
        if (res.data.code == 200 && res.data.data) {
          location.href = res.data.data
        }
      })
      return
      let column = []

      let header = {}
      let data = {}
      let index = 2
      let output = {}
      let ref = ''
      let merges = []
      let wb = {}
      switch (this.summation) {
        case 0:
          header = {
            A1: {v: '单号'},
            B1: {v: '日期'},
            C1: {v: '厂商编号'},
            D1: {v: '厂商简称'},
            E1: {v: '进'},
            F1: {v: '退'},
            G1: {v: '进额'},
            H1: {v: '折让金额'},
            I1: {v: '已付金额'},
            J1: {v: '成本'},
            K1: {v: '其他应付'},
            L1: {v: '币种'}
          }

          //表格数据
          this.allData.forEach(e => {
            data['A'+index] = {v:e.sequence}
            data['B'+index] = {v:e.time}
            data['C'+index] = {v:e.manufacturerNo}
            data['D'+index] = {v:e.manufacturerName}
            data['E'+index] = {v:e.inputNumber}
            data['F'+index] = {v:e.outNumber}
            data['G'+index] = {v:e.inputTotalMoney}
            data['H'+index] = {v:e.discountMoney}
            data['I'+index] = {v:e.paymentMoney}
            data['J'+index] = {v:e.costTotalMoney}
            data['K'+index] = {v:e.otherPaymentMoney}
            data['L'+index] = {v:e.currency}
            index++
          })

          data['A'+index] = {v:'合计：'}
          data['E'+index] = {v:this.summationData.inputNumber}
          data['F'+index] = {v:this.summationData.outNumber}
          data['G'+index] = {v:this.summationData.inputTotalMoney}
          data['H'+index] = {v:this.summationData.discountMoney}
          data['I'+index] = {v:this.summationData.paymentMoney}
          data['J'+index] = {v:this.summationData.costTotalMoney}
          data['K'+index] = {v:this.summationData.otherPaymentMoney}
          index++

          data['A'+index] = {v:'上次余额'}
          data['B'+index] = {v:this.lastBalance}
          data['C'+index] = {v:'本次未付清'}
          data['D'+index] = {v:this.unpaid}
          data['E'+index] = {v:'应付金额'}
          data['F'+index] = {v:this.amountsPayable}
          index++

          // 合并 headers 和 data
          output = Object.assign({}, header, data);
          // 表格范围，范围越大生成越慢 
          ref = 'A1:L' + (this.allData.length + 10)
          //合并单元格设置
          merges = []
          // 构建 workbook 对象
          wb = {
            SheetNames: ['厂商对账单'],
            Sheets: {
              '厂商对账单': Object.assign({}, output, { '!ref': ref, '!merges': merges })
            }
          }
          // 导出 Excel
          XLSX.writeFile(wb, '厂商对账单不集合.xlsx')
          return
          column = [
            {key:'sequence',title:'单号',type: 'text'},
            {key:'time',title:'日期',type: 'text'},
            {key:'manufacturerNo',title:'厂商编号',type: 'text'},
            {key:'manufacturerName',title:'厂商简称',type: 'text'},
            {key:'inputNumber',title:'进',type: 'text'},
            {key:'outNumber',title:'退',type: 'text'},
            {key:'inputTotalMoney',title:'进额',type: 'text'},
            {key:'discountMoney',title:'折让金额',type: 'text'},
            {key:'paymentMoney',title:'已付金额',type: 'text'},
            {key:'costTotalMoney',title:'成本',type: 'text'},
            {key:'otherPaymentMoney',title:'其他应付',type: 'text'},
            {key:'currency',title:'币种',type: 'text'}
          ]
          table2excel(column, this.allData, "厂商对账单不集合.xls")
          break;
        case 1:
          header = {
            A1: {v: '厂商编号'},
            B1: {v: '厂商简称'},
            C1: {v: '进货数量'},
            D1: {v: '退货数量'},
            E1: {v: '进货金额'},
            F1: {v: '退货金额'},
            G1: {v: '其他应付'},
            H1: {v: '折让金额'},
            I1: {v: '已付金额'},
            J1: {v: '日期'},
            K1: {v: '币种'}
          }

          //表格数据
          this.allData.forEach(e => {
            data['A'+index] = {v:e.manufacturerNo}
            data['B'+index] = {v:e.manufacturerName}
            data['C'+index] = {v:e.inputNumber}
            data['D'+index] = {v:e.outNumber}
            data['E'+index] = {v:e.inputTotalMoney}
            data['F'+index] = {v:e.outTotalMoney}
            data['G'+index] = {v:e.otherPaymentMoney}
            data['H'+index] = {v:e.discountMoney}
            data['I'+index] = {v:e.paymentMoney}
            data['J'+index] = {v:e.time}
            data['K'+index] = {v:e.currency}
            index++
          })

          data['A'+index] = {v:'合计：'}
          data['C'+index] = {v:this.summationData.inputNumber}
          data['D'+index] = {v:this.summationData.outNumber}
          data['E'+index] = {v:this.summationData.inputTotalMoney}
          data['F'+index] = {v:this.summationData.outTotalMoney}
          data['G'+index] = {v:this.summationData.otherPaymentMoney}
          data['H'+index] = {v:this.summationData.discountMoney}
          data['I'+index] = {v:this.summationData.paymentMoney}
          index++

          data['A'+index] = {v:'上次余额'}
          data['B'+index] = {v:this.lastBalance}
          data['C'+index] = {v:'本次未付清'}
          data['D'+index] = {v:this.unpaid}
          data['E'+index] = {v:'应付金额'}
          data['F'+index] = {v:this.amountsPayable}
          index++

          // 合并 headers 和 data
          output = Object.assign({}, header, data);
          // 表格范围，范围越大生成越慢 
          ref = 'A1:I' + (this.allData.length + 10)
          //合并单元格设置
          merges = []
          // 构建 workbook 对象
          wb = {
            SheetNames: ['厂商对账单'],
            Sheets: {
              '厂商对账单': Object.assign({}, output, { '!ref': ref, '!merges': merges })
            }
          }
          // 导出 Excel
          XLSX.writeFile(wb, '厂商对账单厂商集合.xlsx')
          return
          column = [
            {key:'manufacturerNo',title:'厂商编号',type: 'text'},
            {key:'manufacturerName',title:'厂商简称',type: 'text'},
            {key:'inputNumber',title:'进货数量',type: 'text'},
            {key:'outNumber',title:'退货数量',type: 'text'},
            {key:'inputTotalMoney',title:'进货金额',type: 'text'},
            {key:'outTotalMoney',title:'退货金额',type: 'text'},
            {key:'otherPaymentMoney',title:'其他应付',type: 'text'},
            {key:'discountMoney',title:'折让金额',type: 'text'},
            {key:'paymentMoney',title:'已付金额',type: 'text'},
            {key:'time',title:'日期',type: 'text'},
            {key:'currency',title:'币种',type: 'text'},
          ]
          table2excel(column, this.allData, "厂商对账单厂商集合.xls")
          break;
        case 2:
          header = {
            A1: {v: '日期'},
            B1: {v: '进货数量'},
            C1: {v: '退货数量'},
            D1: {v: '进货金额'},
            E1: {v: '退货金额'},
            F1: {v: '其他应付'},
            G1: {v: '折让金额'},
            H1: {v: '已付金额'},
            I1: {v: '币种'}
          }

          //表格数据
          this.allData.forEach(e => {
            data['A'+index] = {v:e.time}
            data['B'+index] = {v:e.inputNumber}
            data['C'+index] = {v:e.outNumber}
            data['D'+index] = {v:e.inputTotalMoney}
            data['E'+index] = {v:e.outTotalMoney}
            data['F'+index] = {v:e.otherPaymentMoney}
            data['G'+index] = {v:e.discountMoney}
            data['H'+index] = {v:e.paymentMoney}
            data['I'+index] = {v:e.currency}
            index++
          })

          data['A'+index] = {v:'合计：'}
          data['B'+index] = {v:this.summationData.inputNumber}
          data['C'+index] = {v:this.summationData.outNumber}
          data['D'+index] = {v:this.summationData.inputTotalMoney}
          data['E'+index] = {v:this.summationData.outTotalMoney}
          data['F'+index] = {v:this.summationData.otherPaymentMoney}
          data['G'+index] = {v:this.summationData.discountMoney}
          data['H'+index] = {v:this.summationData.paymentMoney}
          index++

          data['A'+index] = {v:'上次余额'}
          data['B'+index] = {v:this.lastBalance}
          data['C'+index] = {v:'本次未付清'}
          data['D'+index] = {v:this.unpaid}
          data['E'+index] = {v:'应付金额'}
          data['F'+index] = {v:this.amountsPayable}
          index++

          // 合并 headers 和 data
          output = Object.assign({}, header, data);
          // 表格范围，范围越大生成越慢 
          ref = 'A1:I' + (this.allData.length + 10)
          //合并单元格设置
          merges = []
          // 构建 workbook 对象
          wb = {
            SheetNames: ['厂商对账单'],
            Sheets: {
              '厂商对账单': Object.assign({}, output, { '!ref': ref, '!merges': merges })
            }
          }
          // 导出 Excel
          XLSX.writeFile(wb, '厂商对账单日期集合.xlsx')
          return
          column = [
            {key:'time',title:'日期',type: 'text'},
            {key:'inputNumber',title:'进货数量',type: 'text'},
            {key:'outNumber',title:'退货数量',type: 'text'},
            {key:'inputTotalMoney',title:'进货金额',type: 'text'},
            {key:'outTotalMoney',title:'退货金额',type: 'text'},
            {key:'otherPaymentMoney',title:'其他应付',type: 'text'},
            {key:'discountMoney',title:'折让金额',type: 'text'},
            {key:'paymentMoney',title:'已付金额',type: 'text'},
            {key:'currency',title:'币种',type: 'text'},
          ]
          table2excel(column, this.allData, "厂商对账单日期集合.xls")
          break;
      }
    },

    // 每页显示页数改变
    handleSizeChange(val){
      this.limit = val
      this.currentPage = 1
      this.tableTypeChange = !this.tableTypeChange
      this.search()
    },
    // 当前页改变
    handleCurrentChange(val){
      this.currentPage = val
      this.search()
    },

    getSummaries(param){
      const { columns, data } = param
      const sums = []
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计'
          return
        }
        if (this.summation == 0 && index === 1) {
          sums[index] = '上次余额:' + this.lastBalance
          return
        }
        if (this.summation == 0 && index === 2) {
          sums[index] = '本次未付清:' + this.unpaid
          return
        }
        if (this.summation == 0 && index === 3) {
          sums[index] = '应付金额:' + this.amountsPayable
          return
        }
        // if (this.summation == 0 && index === 4) {
        //   sums[index] = this.amountsPayable
        //   return
        // }
        const prop = column.property
        switch (prop) {
          case 'inputNumber':
            sums[index] = this.summationData.inputNumber || ''
            break;
          case 'outNumber':
            sums[index] = this.summationData.outNumber || ''
            break;
          case 'inputTotalMoney':
            sums[index] = this.summationData.inputTotalMoney || ''
            break;
          case 'outTotalMoney':
            sums[index] = this.summationData.outTotalMoney || ''
            break;
          case 'discountMoney':
            sums[index] = this.summationData.discountMoney || ''
            break;
          case 'paymentMoney':
            sums[index] = this.summationData.paymentMoney || ''
            break;
          case 'costTotalMoney':
            sums[index] = this.summationData.costTotalMoney || ''
            break;
          case 'otherPaymentMoney':
            sums[index] = this.summationData.otherPaymentMoney || ''
            break;
        }
        let decimal = sums[index] ? sums[index].toString().split('.')[1] : ''
        if (decimal && decimal.length > 2) {
          sums[index] = sums[index].toFixed(2)
        }
      })
      return sums
    },

    printClick(){
      if (!this.allData.length) {
        this.$message.info('暂无数据')
        return
      }
      document.getElementById('p').innerHTML = ''
      this.openPrint()
    },
    openPrint(n=0){
      let name = ''
      let contact = ''
      let phone = ''
      let address = ''
      const length = this.allData.length

      if (this.manufacturerName.length) {
        for (const i of this.manufacturerList) {
          // console.log(i)
          // console.log(this.manufacturerName[0])
          if (this.manufacturerName[0] == i.value) {
            name = i.label || ''
            contact = i.contact || ''
            phone = i.phone || ''
            address = i.address || ''
            break
          }
        }
      }
      let index = n
      let printBody = document.getElementById('p')
      let printHead = document.createElement('div')
      printHead.innerHTML = `
        <span class="printHead">
          ${this.companyName}${this.jxQuarter}厂商对账单
        </span>
        <div class="info" style="border-top: 1px dashed black;">
          <p>厂商：${name}</p>
          <p>联系人：${contact}</p>
          <p>电话：${phone}</p>
          <p>打印日期：${this.today}</p>
        </div>
        <div class="info" style="border-bottom: 1px dashed black;">
          <p>厂商地址：${address}</p>
        </div>
      `
      printHead.style.pageBreakBefore = 'always'
      printHead.style.paddingTop = '5mm'
      printBody.appendChild(printHead)

      let printTable = document.createElement('table')
      switch (this.summation) {
        case 0:
          printTable.innerHTML = `
            <tr>
              <td width='4%'>序号</td>
              <td width='12%'>单号</td>
              <td width='15%'>厂商简称</td>
              <td>进货数</td>
              <td>退货数</td>
              <td>进货金额</td>
              <td>退货金额</td>
              <td>其他应付</td>
              <td>折让金额</td>
              <td>已付金额</td>
            </tr>
          `
          break;
        case 1:
          printTable.innerHTML = `
            <tr>
                <td width='5%'>序号</td>
                <td width='15%'>厂商简称</td>
                <td>进货数</td>
                <td>退货数</td>
                <td>进货金额</td>
                <td>退货金额</td>
                <td>其他应付</td>
                <td>折让金额</td>
                <td>已付金额</td>
                <td width='10%'>日期</td>
              </tr>
            `
          break;
        case 2:
          printTable.innerHTML = `
            <tr>
              <td width='5%'>序号</td>
              <td>进货数</td>
              <td>退货数</td>
              <td>进货金额</td>
              <td>退货金额</td>
              <td>其他应付</td>
              <td>折让金额</td>
              <td>已付金额</td>
              <td width='10%'>日期</td>
            </tr>
          `
          break;
      }
      let row = null
      for (index; index < length; index++) {
        const e = this.allData[index]
        row = printTable.insertRow(printTable.FetchRowCount)
        row.insertCell(0).innerHTML = index + 1
        switch (this.summation) {
          case 0:
            row.insertCell(1).innerHTML = e.sequence
            row.insertCell(2).innerHTML = e.manufacturerName
            row.insertCell(3).innerHTML = e.inputNumber
            row.insertCell(4).innerHTML = e.outNumber
            row.insertCell(5).innerHTML = e.inputTotalMoney
            row.insertCell(6).innerHTML = e.outTotalMoney
            row.insertCell(7).innerHTML = e.otherPaymentMoney
            row.insertCell(8).innerHTML = e.discountMoney
            row.insertCell(9).innerHTML = e.paymentMoney
            break;
          case 1:
            row.insertCell(1).innerHTML = e.manufacturerName
            row.insertCell(2).innerHTML = e.inputNumber
            row.insertCell(3).innerHTML = e.outNumber
            row.insertCell(4).innerHTML = e.inputTotalMoney
            row.insertCell(5).innerHTML = e.outTotalMoney
            row.insertCell(6).innerHTML = e.otherPaymentMoney
            row.insertCell(7).innerHTML = e.discountMoney
            row.insertCell(8).innerHTML = e.paymentMoney
            row.insertCell(9).innerHTML = e.time
            break;
          case 2:
            row.insertCell(1).innerHTML = e.inputNumber
            row.insertCell(2).innerHTML = e.outNumber
            row.insertCell(3).innerHTML = e.inputTotalMoney
            row.insertCell(4).innerHTML = e.outTotalMoney
            row.insertCell(5).innerHTML = e.otherPaymentMoney
            row.insertCell(6).innerHTML = e.discountMoney
            row.insertCell(7).innerHTML = e.paymentMoney
            row.insertCell(8).innerHTML = e.time
            break;
        }
        if (parseInt((index+1)/36) && (index+1)%36 == 0 && (index+1) != length) {
          printBody.appendChild(printTable)
          this.openPrint(index+1)
          return
        }
        if ((index+1) == length) {
          // 最后一条
          let lastItem = length%36
          if (!lastItem || lastItem > 33) {
            printBody.appendChild(printTable)
            this.openPrint(index+1)
            return
          }
        }
      }
      row = printTable.insertRow(printTable.FetchRowCount)
      row.insertCell(0).innerHTML = '合计'
      switch (this.summation) {
        case 0:
          row.insertCell(1).innerHTML = ''
          row.insertCell(2).innerHTML = ''
          row.insertCell(3).innerHTML = this.summationData.inputNumber
          row.insertCell(4).innerHTML = this.summationData.outNumber
          row.insertCell(5).innerHTML = this.summationData.inputTotalMoney
          row.insertCell(6).innerHTML = this.summationData.outTotalMoney
          row.insertCell(7).innerHTML = this.summationData.otherPaymentMoney
          row.insertCell(8).innerHTML = this.summationData.discountMoney
          row.insertCell(9).innerHTML = this.summationData.paymentMoney
          break;
        case 1:
          row.insertCell(1).innerHTML = ''
          row.insertCell(2).innerHTML = this.summationData.inputNumber
          row.insertCell(3).innerHTML = this.summationData.outNumber
          row.insertCell(4).innerHTML = this.summationData.inputTotalMoney
          row.insertCell(5).innerHTML = this.summationData.outTotalMoney
          row.insertCell(6).innerHTML = this.summationData.otherPaymentMoney
          row.insertCell(7).innerHTML = this.summationData.discountMoney
          row.insertCell(8).innerHTML = this.summationData.paymentMoney
          row.insertCell(9).innerHTML = ''
          break;
        case 2:
          row.insertCell(1).innerHTML = this.summationData.inputNumber
          row.insertCell(2).innerHTML = this.summationData.outNumber
          row.insertCell(3).innerHTML = this.summationData.inputTotalMoney
          row.insertCell(4).innerHTML = this.summationData.outTotalMoney
          row.insertCell(5).innerHTML = this.summationData.otherPaymentMoney
          row.insertCell(6).innerHTML = this.summationData.discountMoney
          row.insertCell(7).innerHTML = this.summationData.paymentMoney
          row.insertCell(8).innerHTML = ''
          break;
      }
      printBody.appendChild(printTable)

      let printFoot = document.createElement('div')
      printFoot.innerHTML = `
        <div class="info" style="border-bottom: 1px dashed black;font-weight: bold;">
          <p>上次余额：￥${this.lastBalance} 本次未付：￥${this.unpaid} 应付金额：￥${this.amountsPayable}</p>
        </div>
        <div class="info" style="padding-right: 35mm;">
          <p>电话：${this.companyPhone}</p>
          <p>主管：</p>
          <p>财务：</p>
          <p>复核:</p>
        </div>
        <div class="info" style="font-weight: bold;">
          <p>请于三日内核对，逾期不予处理。</p>
        </div>
      `
      printBody.appendChild(printFoot)

      let printHtml = document.getElementById('p').innerHTML
      let wind = window.open("",'newwindow', 'height=500, width=1000, top=100, left=100, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no')
      wind.document.body.innerHTML = printHtml
      let style = document.createElement('style')
      style.type = 'text/css'
      style.innerHTML = resources.printCSS
      wind.document.head.appendChild(style)
      wind.print()
    }
  },
  components: {
    footView
  },
}
</script>